<html>
<head>
    <meta charset="utf-8">
    <meta name="keywords" content=""/>
    <meta name="description" content=""/>
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
    <!-- Mobile Specific Metas -->
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">

    <link rel="stylesheet" href="stylesheets/style.css"/>
    <link rel="stylesheet" href="components/font-awesome/css/font-awesome.css"/>

    <title>My App</title>
</head>
<body>
<div class="navbar">
    <div class="navbar-inner">
        <div class="navbar-left">
            <i class="fa fa-angle-left" style="color: #fff;"></i>
        </div>
        <div class="navbar-center">
            <img src="images/5u-logo.jpg" alt="5u logo"/>
        </div>
        <div class="navbar-right">
            <i class="fa fa-angle-right" style="color: #fff;"></i>
        </div>
    </div>
</div>
<div class="toolbar">
    <div class="square">
        <span><i class="icon-square"></i>广场</span>
    </div>
    <div class="search">
        <span><i class="icon-search"></i>Search</span>
    </div>
    <div class="person-info">
        <span><i class="icon-person-info"></i>个人</span>
    </div>
</div>
<div class="view" style="display: none;">
    <div class="group-tab">
        <a class="tab-btn-2" href="#">热点</a>
        <a class="active tab-btn-2" href="#">关注</a>
    </div>
    <div class="content">
        <ul class="list">
            <li class="item">
                <div class="author-brief">
                    <div class="author-thumb">
                        <img src="#" alt=""/>
                    </div>
                    <div class="author-desc">
                        <p class="author-name">Name</p>
                        <p class="desc"><span class="timer">3分钟前</span>来自<span class="qiumihui-name"></span></p>
                    </div>
                </div>
                <div class="article">
                    <h3 class="title">This is a Title</h3>
                    <div class="article-content">
                        <ul class="article-content-thumbs">
                            <li><img src="#" alt=""/></li>
                            <li><img src="#" alt=""/></li>
                            <li><img src="#" alt=""/></li>
                        </ul>
                    </div>
                </div>
            </li>
            <li class="item">
                <div class="author-brief">
                    <div class="author-thumb">
                        <img src="#" alt=""/>
                    </div>
                    <div class="author-desc">
                        <p class="author-name">Name</p>
                        <p class="desc"><span class="timer">3分钟前</span>来自<span class="qiumihui-name"></span></p>
                    </div>
                </div>
                <div class="article">
                    <h3 class="title">This is a Title</h3>
                    <div class="article-content">
                        <ul class="article-content-thumbs">
                            <li><img src="#" alt=""/></li>
                            <li><img src="#" alt=""/></li>
                            <li><img src="#" alt=""/></li>
                        </ul>
                    </div>
                </div>
            </li>
            <li class="item">
                <div class="author-brief">
                    <div class="author-thumb">
                        <img src="#" alt=""/>
                    </div>
                    <div class="author-desc">
                        <p class="author-name">Name</p>
                        <p class="desc"><span class="timer">3分钟前</span>来自<span class="qiumihui-name"></span></p>
                    </div>
                </div>
                <div class="article">
                    <h3 class="title">This is a Title</h3>
                    <div class="article-content">
                        <ul class="article-content-thumbs">
                            <li><img src="#" alt=""/></li>
                            <li><img src="#" alt=""/></li>
                            <li><img src="#" alt=""/></li>
                        </ul>
                    </div>
                </div>
            </li>
            <li class="item">
                <div class="author-brief">
                    <div class="author-thumb">
                        <img src="#" alt=""/>
                    </div>
                    <div class="author-desc">
                        <p class="author-name">Name</p>
                        <p class="desc"><span class="timer">3分钟前</span>来自<span class="qiumihui-name"></span></p>
                    </div>
                </div>
                <div class="article">
                    <h3 class="title">This is a Title</h3>
                    <div class="article-content">
                        <ul class="article-content-thumbs">
                            <li><img src="#" alt=""/></li>
                            <li><img src="#" alt=""/></li>
                            <li><img src="#" alt=""/></li>
                        </ul>
                    </div>
                </div>
            </li>
        </ul>
        <div class="load-more">加载更多</div>
    </div>
</div>
<script>
    var docH = document.documentElement.clientHeight,
            docW = document.documentElement.clientWidth,
            html = document.getElementsByTagName("html")[0];
    var rate = docW / 320;
    html.style.fontSize = 12 * rate + "px";
</script>
</body>
</html>